<template>
  <div  class="mian">    
    <!--
    <RouterLink exact-active-class="active" to="/">Home</RouterLink> | 
    <RouterLink exact-active-class="active" to="/helloWorld">helloWorld</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page13">page13</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page13_1">page13_1</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page14">page14</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page15">page15</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page16">page16</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page17">page17</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page18">page18</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page19">page19</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page20">page20</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page21">page21</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page22">page22</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page23">page23</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page24">page24</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page25">page25</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page26">page26</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page27">page27</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page28">page28</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page29">page29</RouterLink> |    
    <RouterLink exact-active-class="active" to="/page31">page31</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page32">page32</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page33">page33</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page34">page34</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page35">page35</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page36">page36</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page37">page37</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page38">page38</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page39">page39</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page40">page40</RouterLink> | 
    <RouterLink exact-active-class="active" to="/page41">page41</RouterLink> |     
    <RouterLink exact-active-class="active" to="/page45">page45</RouterLink> |   
    <RouterLink exact-active-class="active" to="/page46">page46</RouterLink> |   
    <RouterLink exact-active-class="active" to="/page47">page47</RouterLink> |   
    <RouterLink exact-active-class="active" to="/page48">page48</RouterLink> |   
    <RouterLink exact-active-class="active" to="/page49">page49</RouterLink> |   
    <RouterLink exact-active-class="active" to="/page50">page50</RouterLink> |   
    <RouterLink exact-active-class="active" to="/page51">page51</RouterLink> |   
    <RouterLink exact-active-class="active" to="/page52">page52</RouterLink> |
    <RouterLink exact-active-class="active" to="/page53">page53</RouterLink> |   
    <RouterLink exact-active-class="active" to="/page54">page54</RouterLink> |   
    <RouterLink exact-active-class="active" to="/page55">page55</RouterLink> |   
    <RouterLink exact-active-class="active" to="/page56">page56</RouterLink> |   
    <RouterLink exact-active-class="active" to="/page57">page57</RouterLink> |   
    <RouterLink exact-active-class="active" to="/page58">page58</RouterLink> |   
    <RouterLink exact-active-class="active" to="/page59">page59</RouterLink> |   
    <RouterLink exact-active-class="active" to="/page60">page60</RouterLink> |
    <RouterLink exact-active-class="active" to="/page61">page61</RouterLink> |
    <RouterLink exact-active-class="active" to="/page62">page62</RouterLink> |
    <RouterLink exact-active-class="active" to="/page63">page63</RouterLink> |
    <RouterLink exact-active-class="active" to="/page64">page64</RouterLink> |
    <RouterLink exact-active-class="active" to="/aboutPage">aboutPage</RouterLink> | 
    <RouterLink exact-active-class="active" to="/indexPage">IndexPage</RouterLink> |
    <RouterLink exact-active-class="active" to="/Permission">Permission</RouterLink> |
    -->
    <!-- 路由展示区 -->
    <!-- 
    <p id="title2" ref="title2"> App你好</p>
    <button @click="showLog">App title2</button> 
    -->
    <!-- 袁进 -->
    <RouterLink exact-active-class="active" to="/yuanjin01">图片调色盘</RouterLink> |
    <RouterLink exact-active-class="active" to="/yuanjin02">静态资源动态加载</RouterLink> |
    <RouterView />
  </div>
</template>

<script setup lang="ts">
import { RouterLink, RouterView } from 'vue-router'
</script>

<style scoped>
.active {
  color: skyblue !important;
  font-weight: bold;
}
.mian {
  width: 100%;
  height: 100%;
  font-size: 20px;  
  color: #000;
  a {
    color: #000;    
  }
}
</style>
